
<script>
import { mapState, mapGetters, mapMutations } from 'vuex'
import storage from '@/tools/storage.js'
import { userUserFindPromoterCode } from '@api/user.js'

export default {
	name: 'MainNav',
	data() {
		return {}
	},
	mounted() {
		this.hideTuiGuang()
	},
	computed: {
		...mapState(['agentStatus', 'userInfo']),
		...mapGetters(['getAllVariety', 'getTradeTime'])
	},
	methods: {
		...mapMutations(['setGold', 'setCurVariety']),
		hideTuiGuang: function() {
			var t = this,
				e = window.location.origin
			;['dl5.', 'dl9.', 'dl13.', 'gf7.', 'gf8.', 'hqjt.'].forEach(function(s, i) {
				e.includes(s) && (t.$refs.tuiGuang.style.display = 'none')
			})
		},
		getGoldTrade() {
			var curVariety = JSON.parse(storage.getItem('curVariety'))
			var allVariety = JSON.parse(storage.getItem('allVariety'))
			if (!curVariety) {
				curVariety = allVariety[0]
			}
			this.$store.commit('setCurVariety', curVariety)
			this.$store.commit('setGold', true)
			this.$router.push({
				path: '/trade'
			})
		},
		getTuiguangInfo() {
			console.log('agentStatus-->', this.agentStatus)
			if (this.agentStatus === 503) {
				this.$router.push({ path: '/login' })
			} else if (this.agentStatus === 200) {
				this.$router.push({ path: '/activity/tuiguang' })
			} else if (this.agentStatus === 600) {
				MessageBox.confirm('', {
					title: '推广赚钱',
					message: '您还不是推广员，是否要成为推广员?',
					confirmButtonText: '申请',
					confirmButtonClass: 'red'
				}).then(() => {
					this.applyTuiGuang()
				})
			}
		},
		applyTuiGuang() {
			Indicator.open({
				text: '申请中...',
				spinnerType: 'fading-circle'
			})
			axios({
				methods: 'get',
				url: '/user/user/toBePromoter.do',
				params: {}
			}).then(res => {
				Indicator.close()
				res = res.data
				if (res.code == 200) {
					Toast(res.msg)
					this.$router.push({
						path: '/activity/tuiguang'
					})
				} else if (res.code == 503) {
					this.$router.push({
						path: '/login'
					})
				} else {
					Toast(res.msg)
				}
			})
		}
	},
	render() {
        const isLogin = this.userInfo.userPhone;
		return (
			<div class="pt10 pb5 bgwhite">
                <ul class="pl10 pr10 flex">
                    <li class="flex1">
                        <a href="javascript:;" onClick={this.getGoldTrade.bind(this)}>
                            <img src={require('@images/moni.png')}  alt='' />
                            <h4 class="lh25 fontc1 fs14 zitiyangshi">模拟交易</h4>
                        </a>
                    </li>
                    <li class="flex1">
                        <a href="javascript:;">
                            <router-link to={isLogin ? "/news/info" : '/activity/tuiguangreg?abc=1'}>
                                <img src={isLogin ? require('@images/zixun.png') : require('@images/zixun.png')}  alt='' />
                                <h4 class="lh25 fontc1 fs14 zitiyangshi">{isLogin?'新闻资讯':'开户领钱'}</h4>
                            </router-link>
                        </a>
                    </li>
                    <li class="flex1" ref="tuiGuang">
                        <a href="javascript:;" onClick={this.getTuiguangInfo.bind(this)}>
                            <img src={require('@images/tuiguang.png')}  alt='' />
                            <h4 class="lh25 fontc1 fs14 zitiyangshi">推广赚钱</h4>
                        </a>
                    </li>
                    <li class="flex1">
                        <a href="javascript:;">
                            <router-link to="/service">
                                <img src={require('@images/kefu.png')}  alt='' />
                                <h4 class="lh25 fontc1 fs14 zitiyangshi">联系客服</h4>
                            </router-link>
                        </a>
                    </li>
                </ul>
            </div>
		)
	}
}
</script>
<style scoped lang='scss'>
img {
	display: block;
	margin: 0 auto;
	width: rem(30px);
	height: rem(30px);
	margin-bottom:15px;
}
.zitiyangshi{
	font-size: 12px;
    font-weight: 600;
}
ul li a {
	display: block;
}
</style>